﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UserInterface1_async.aspx.cs"
    Inherits="AjaxApp.UserInterface1_async" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <script type="text/javascript">

        var xmlhttp = null;

        function ajaxCall() {
            alert("ready to make ajax call");
            if (window.XMLHttpRequest) {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            }
            else {
                // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }

            var url = "Server1.aspx";

            // This is asynchronous (because of the "true").
            xmlhttp.open("GET", url, true);
            xmlhttp.onreadystatechange = ajaxCallBack;
            xmlhttp.send(null);
        }

        // This gets called only when the server responds.
        function ajaxCallBack() {
            alert('handling response. readyState is ' +
            xmlhttp.readyState + ' status is ' + xmlhttp.status);
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                //alert('handling response ready 4 status 200');
                alert("got a response");
                document.getElementById("serverResponse").innerHTML = xmlhttp.responseText;
            }
        }

    
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input id="Button1" type="button" value="Calling Server1.aspx.cs" onclick="ajaxCall();" />
        This example also takes no user input, but the call is async (UI is freed up while waiting for the response).
        <br /> Respose from Server: &nbsp;<span id="serverResponse"></span>
    </div>
    </form>
</body>
</html>
